<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>学科信息</title>
    <style>
		/* 此处省略层叠样式表 */
    </style>
</head>
{% include 'header.html' %}
{% verbatim %}
<body>
    <div id="container">
        <h1>smog学院所有学科</h1>
        <hr>
        <div id="main">
            <dl v-for="subject in subjects">
                <dt>
                    <a :href="'/teachers?sno=' + subject.no">
                        {{ subject.name }}
                    </a>
                    <img v-if="subject.is_hot" src="../static/images/hot.png">
                </dt>
                <dd>{{ subject.intro }}</dd>
            </dl>
        </div>
    </div>
    <script src="https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/vue/2.6.14/vue.min.js" type="application/javascript"></script>
    <script>
        let app = new Vue({
            el: '#main',
            data: {
                subjects: []
            },
            created() {
                fetch('/api/subjects/',{"headers":{"x-requested-with":"XMLHttpRequest"}})
                    .then(resp => resp.json())
                    .then(json => {
                        this.subjects = json
                    })
            }
        })
    </script>
</body>
{% endverbatim %}
</html>